<template>
  <div>
    <Header title="设备并修列表" />
    <div>
      <div class="textScroll">
        <van-row>
          <van-col span="6" offset="2"
            ><van-button
              :block="true"
              @click="selectAll"
              type="info"
              :text="selectFont"
          /></van-col>
          <van-col span="6" offset="2"
            ><van-button
              :block="true"
              type="danger"
              @click="assignone"
              text="否"
          /></van-col>
          <van-col span="6" offset="2">
            <van-button
              :block="true"
              style="margin-right: 5%"
              type="primary"
              @click="assign"
              text="是"
          /></van-col>
        </van-row>

        <!-- 循环数据开始 -->
        <div v-for="(item, index) in itemsOne" :key="item.id">
          <div style="width: 100%; background-color: #f3f4f8; height: 5px">
            <span></span>
          </div>
          <div class="divStyle">
            <van-row style="margin-top: 10px; margin-left: 10px">
              <van-col span="8" style="font-weight: bold; color: #a9a9a9">{{
                item.description
              }}</van-col>
              <van-col span="14" style="color: #a9a9a9"
                ><van-icon name="assets/time.png" />
                {{ item.requestTime }}</van-col
              >
              <van-col span="2" style="color: #a9a9a9" @click.stop=""
                ><van-checkbox
                  checked-color="#138087"
                  v-model="item.checked"
                  @click.prevent="item.checked ? false : true"
                  shape="square"
                ></van-checkbox
              ></van-col>
            </van-row>
            <van-divider />
            <van-row style="margin-left: 10px">
              <van-col span="18" style="color: #a9a9a9"
                >设备编码：{{ item.equipName }}</van-col
              >
            </van-row>
            <van-row style="margin-left: 10px; margin-top: 10px">
              <van-col span="18" style="color: #a9a9a9"
                >报修单号：{{ item.requestCode }}</van-col
              >
            </van-row>
            <van-row style="margin-left: 10px; margin-top: 10px">
              <van-col span="18" style="color: #a9a9a9"
                >报修描述：{{ item.remark }}</van-col
              >
            </van-row>
            <van-row style="margin-left: 10px; margin-top: 10px">
              <van-col span="18" style="color: #138087"
                >报修人：{{ item.requestUser }}</van-col
              >
              <van-col span="3"
                ><van-button
                  color="#138087"
                  style="
                    width: 75px;
                    height: 30px;
                    margin-bottom: 10px;
                    right: 0px;
                  "
                  type="primary"
                  text="详情"
                  @click.prevent="showDetail(item)"
              /></van-col>
              <!-- <van-col span="3"><van-image width="40" height="30" src="assets/noAssign.png"/></van-col> -->
            </van-row>
          </div>
        </div>
        <!-- 循环数据结束 -->
      </div>
      <!-- <van-button
        :block="true"
        class="buttonLeft1"
        @click="back"
        type="primary"
        text="否"
      />
      <van-button
        :block="true"
        class="buttonRight1"
        type="primary"
        @click="assign"
        text="是"
      /> -->
    </div>
  </div>
</template>
<script>
import {
  Icon,
  Button,
  CellGroup,
  Cell,
  Field,
  tab,
  tabs,
  Col,
  Popup,
  Row,
  Image as VanImage,
  Divider,
  Checkbox,
  Pagination,
  Panel,
  Toast,
  Dialog,
  List,
  RadioGroup,
  Radio,
} from "vant";
import { _httpClient } from "@/libs/api";
import { storage } from "@/libs/utils";
import {
  removeToken,
  getToken,
  setBaseApiFrefix,
  getBaseApiFrefix,
} from "@/libs/auth";
import { memory } from "@/libs/utils";
Vue.use(Cell);
Vue.use(CellGroup);
Vue.use(tab);
Vue.use(tabs);
Vue.use(Button);
Vue.use(Col);
Vue.use(Popup);
Vue.use(Row);
Vue.use(Icon);
Vue.use(VanImage);
Vue.use(Divider);
Vue.use(Checkbox);
Vue.use(Pagination);
Vue.use(Panel);
Vue.use(Dialog);
Vue.use(List);
Vue.use(Radio);
Vue.use(RadioGroup);
import Header from "@/components/header.vue";
import apicloud from "@/libs/apicloud";
export default {
  components: {
    Button,
    Header,
    Icon,
    CellGroup,
    Cell,
    Field,
    tab,
    tabs,
    Col,
    Row,
    Popup,
    RadioGroup,
    Radio,
  },

  data() {
    return {
      code: "",
      itemalone: [],
      requestCode: "",
      equipmentcode: "",
      radio: "1",
      radiolist: [],
      value: "",
      columns: ["抢修", "并修"],
      showPicker: false,
      //动态加载数据
      loading: false,
      finished: false,

      user: [], //登录用户信息
      //分页参数
      queryParams: {
        pageNum: 1,
        pageSize: 5,
        total: 0,
      },

      //下拉刷新动态
      loadParams: {
        pageNum: 1,
        pageSize: 5,
        total: 0,
      },

      allSelected: false,
      selectFont: "一键勾选",
      screenWidth: 0,
      checked: true,
      active: 2,
      currentPage: 1,
      fileUrl: "",
      itemsOne: [
        // { id: 1, equip: '注塑机1', time: '2020-12-02 22:08:00', user: '测试账户1', checked: true },
        // { id: 2, equip: '注塑机2', time: '2020-12-03 22:08:00', user: '测试账户2', checked: false },
        // { id: 3, equip: '注塑机3', time: '2020-12-03 22:08:00', user: '测试账户3', checked: true },
        // { id: 4, equip: '注塑机4', time: '2020-12-03 22:08:00', user: '测试账户4', checked: true },
        // { id: 5, equip: '注塑机5', time: '2020-12-03 22:08:00', user: '测试账户5', checked: false },
      ],
      itemsTwo: [], //已指派列表
    };
  },
  created: function () {
    let oldHight = api.winWidth;
    this.screenWidth = oldHight;
    //获取当前系统登录用户
    this.user = JSON.parse(storage.get("user"));
    this.requestCode = api.pageParam.requestCode;
    // alert(this.requestCode);
    //alert(this.equipmentcode);
    let tkn = getToken();
    if (!tkn) {
      api.openWin({
        name: "login",
        url: "./login-login.html",
        rect: {
          x: 0,
          y: 150,
          w: api.winWidth,
          h: api.winHeight,
        },
      });
    }
    // this.queryWaitAssignList("CJJ13");
    this.showScanner();
  },
  actived: function(){
    this.showScanner();
  },
  methods: {
    getnew() {
      try {
        this.queryWaitAssignList(this.code);
      } catch {}
    },
    showScanner() {
      let _this = this;
      if (
        api.deviceName.toLowerCase() == "huawei" ||
        api.deviceName.toLowerCase() == "honor"
      ) {
        var zyHmsScan = api.require("zyHmsScan");
        var param = {};
        zyHmsScan.openDefaultView(param, function (ret) {
          // let code1 = ret.result;
          // alert(code1);
          _this.queryWaitAssignList(ret.result);
          // _this.code = code1;
        });
      } else {
        var FNScanner = this.$ac.require("FNScanner");
        FNScanner.openScanner(
          {
            autorotation: true,
          },
          function (ret, err) {
            if (ret) {
              if (ret.eventType == "success" && ret.content != "") {
                // let code2 = ret.content;
                // alert(code2);
                _this.queryWaitAssignList(ret.content);
                // _this.code = code2;
              }
            } else {
            }
          }
        );
      }
    },
    onConfirm(value) {
      this.value = value;
      this.showPicker = false;
    },
    //已指派数据动态加载
    onLoad() {
      //页数+1
      this.loadParams.pageNum = this.loadParams.pageNum + 1;
      // 异步更新数据
      // setTimeout 仅做示例，真实场景中一般为 ajax 请求
      setTimeout(() => {
        this.queryCheckedAssignList();
        // 加载状态结束
        this.loading = false;

        // 数据全部加载完成
        if (this.itemsTwo.length >= this.loadParams.total) {
          this.finished = true;
        }
      }, 1000);
    },

    //查询已指派报修单
    async queryCheckedAssignList() {
      let _this = this;
      try {
        let res = await _httpClient.post(
          _httpClient.getApiPrefix() +
            "/app/repair/requestInfo/checkedList?pageNum=" +
            _this.loadParams.pageNum +
            "&pageSize=" +
            _this.loadParams.pageSize,
          {
            body: { siteKey: _this.user.site },
          }
        );

        if (res.code === 200) {
          // Toast.clear()
          if (!_this.finished) {
            for (let i = 0; i < res.rows.length; i++) {
              _this.itemsTwo.push(res.rows[i]);
            }

            _this.loadParams.total = res.total;
            //判断是否已加载完成
            if (_this.itemsTwo.length >= _this.loadParams.total) {
              _this.finished = true;
            }
          }
        } else {
          Toast.fail(res.msg);
        }
      } catch (e) {
        alert(JSON.stringify(e));
        Toast.fail(JSON.stringify(e));
      }
    },

    //tab切换
    tabChange(name, title) {
      if (name == 0) {
        //待指派界面
        this.queryWaitAssignList();
      } else if (name == 1) {
        //已指派界面
        this.queryCheckedAssignList();
      }
    },
    //详情展示
    showDetail(item) {
      api.openWin({
        name: "requestDetail",
        url: "./maintain-requestDetail.html",
        type: "fade",
        pageParam: {
          equip: item,
        },
      });
    },
    back() {
      api.openWin({
        name: "parallelRepairStart",
        url: "./my-parallelRepairStart.html",
        type: "fade",
      });
    },
    // 全选
    selectAll() {
      //判断当前数据是否存在
      if (this.itemsOne.length == 0) {
        Dialog.alert({
          theme: "round-button",
          message: "当前无数据可操作",
        }).then(() => {
          // on close
        });
        return;
      }
      if (!this.allSelected) {
        this.allSelected = true;
        this.selectFont = "取消勾选";
        for (let i = 0; i < this.itemsOne.length; i++) {
          this.itemsOne[i].checked = true;
        }
      } else {
        this.allSelected = false;
        this.selectFont = "一键勾选";
        for (let i = 0; i < this.itemsOne.length; i++) {
          this.itemsOne[i].checked = false;
        }
      }
    },
    //查询待指派保修单
    async queryWaitAssignList(val) {
      let _this = this;
      _this.radiolist = [];
      Toast.loading({
        mask: true,
        forbidClick: true,
        duration: 0,
        message: "Loading...",
      });
      try {
        let res = await _httpClient.post(
          _httpClient.getApiPrefix() + "/app/repair/requestInfo/listbxbyCode?",
          { body: { equipcode: val } }
        );

        if (res.code === 200) {
          Toast.clear();
          res.rows.forEach((element) => {
            if (element.requestCode != _this.requestCode) {
              _this.itemsOne.push(element);
            } else {
              _this.itemalone.push(element);
            }
          });

          if (_this.itemsOne.length > 0) {
            alert(
              "该设备" + val + "存在其他并修没有维修的订单，是否同时维修？"
            );
          } else {
            _this.assignone();
          }
        } else {
          Toast.fail(res.msg);
        }
      } catch (e) {
        alert(JSON.stringify(e));
        Toast.fail(JSON.stringify(e));
      }
    },

    //一键指派
    assign() {
      let _this = this;
      let selecedList = [];
      selecedList.push(_this.itemalone[0]);
      for (let i = 0; i < _this.itemsOne.length; i++) {
        if (_this.itemsOne[i].checked) {
          selecedList.push(_this.itemsOne[i]);
        }
      }
      if (selecedList.length == 1) {
        alert("至少勾选一条明细");
        return;
      }
      if (selecedList.length > 0) {
        api.openWin({
          name: "repairplus",
          url: "./my-repairplus.html",
          type: "fade",
          pageParam: {
            item: selecedList,
          },
        });
      } else {
        Toast.fail("请选择并修设备");
      }
    },

    assignone() {
      let _this = this;
      if (_this.itemalone.length > 0) {
        api.openWin({
          name: "repairplus",
          url: "./my-repairplus.html",
          type: "fade",
          pageParam: {
            item: _this.itemalone,
          },
        });
      } else {
        Toast.fail("请选择并修设备");
      }
    },
    //更新报修单
    async updateRequest(selecedList) {
      let _this = this;
      Toast.loading({
        mask: true,
        forbidClick: true,
        duration: 0,
        message: "Loading...",
      });
      //组装数据
      //storage.set('username', 'admin')

      let ids = []; //操作的报修单
      let equipKey = []; //设备KEY
      let assignUser = []; //指派用户
      let mergetype = []; //设备KEY
      //报修单赋值
      for (let i = 0; i < selecedList.length; i++) {
        ids.push(selecedList[i].id);
        equipKey.push(selecedList[i].eqKey);
        mergetype.push(selecedList[i].mergetype);
      }

      //指派用户
      assignUser.push(_this.user.userName);
      //数据合并
      let param = {
        userName: _this.user.userName,
        userNick: _this.user.nickName,
        ids: ids,
        equipKey: equipKey,
        assignUser: assignUser,
        siteKey: _this.user.site,
        mergetype: mergetype,
      };
      // alert(param)
      // return
      try {
        let res = await _httpClient.post(
          _httpClient.getApiPrefix() +
            "/app/repair/requestInfo/orderRequestplus",
          {
            body: param,
          }
        );

        if (res.code === 200) {
          Toast.clear();

          //移除界面数据
          for (let i = 0; i < selecedList.length; i++) {
            for (let j = 0; j < _this.itemsOne.length; j++) {
              if (selecedList[i].id == _this.itemsOne[j].id) {
                _this.itemsOne.splice(j, 1);
              }
            }
          }
          _this.allSelected = false;
          _this.selectFont = "一键勾选";

          Dialog.alert({
            theme: "round-button",
            message: res.msg,
          }).then(() => {});
        } else {
          Dialog.alert({
            theme: "round-button",
            message: res.msg,
          }).then(() => {
            // on close
          });
          Toast.clear();
        }
      } catch (e) {
        alert(JSON.stringify(e));
        Toast.fail(JSON.stringify(e));
      }
    },
  },
  
};
</script>
<style>
body {
  background-color: White;
}

.pic {
  width: 100%;
  text-align: center;
}

.divMedia {
  margin-top: 10px;
  height: 190px;
  border: solid #dcdcdc;
  margin-left: 5px;
  margin-right: 15px;
  border-top-width: 4px;
  border-left-width: 4px;
  border-right-width: 1px;
}

.clickbtn {
  width: 1;
  margin: 5px 10px;
  line-height: 45px;
  border: 1px #ccc dashed;
  text-align: center;
}

.buttonRight1 {
  position: fixed;
  margin-top: 150%;
  right: 50px;
  width: 90px;
  height: 40px;
  background-color: #1c6c8d;
  border-color: #1c6c8d;
}

.buttonLeft1 {
  position: fixed;
  margin-top: 150%;
  left: 50px;
  width: 90px;
  height: 40px;
  background-color: red;
  border-color: red;
}

.buttonRight {
  position: fixed;
  margin-top: -40px;
  right: 15px;
  width: 90px;
  height: 40px;
  background-color: #1c6c8d;
  border-color: #1c6c8d;
}

.buttonLeft {
  position: fixed;
  margin-top: -40px;
  right: 50px;
  width: 90px;
  height: 40px;
  background-color: #1c6c8d;
  border-color: #1c6c8d;
}

.message {
  font-size: 20px;
  margin-top: 0px;
  margin-left: -10px;
  font-weight: bold;
}

.divStyle {
  /* border: 1px solid #dcdcdc; */
  border-top-width: 3px;
  border-left-width: 3px;
  margin-left: 3px;
  margin-right: 3px;
  margin-top: 4px;
}

.pagination {
  position: fixed;
  bottom: 15px;
  width: 100%;
  color: rgb(0, 0, 255);
  text-align: center;
}

.textScroll {
  display: inline-block;
  position: fixed;
  top: 10%;
  bottom: 5px;
  overflow: scroll;
  right: 0;
  width: 100%;
  margin-bottom: 5%;
  z-index: 1;
}

.textScroll2 {
  display: inline-block;
  position: fixed;
  top: 10rem;
  left: 0;
  bottom: 2px;
  overflow-y: scroll;
  width: 100%;
  margin-bottom: 1.7rem;
  z-index: 1;
  overflow-x: hidden;
  /*解决ios上滑动不流畅*/
  -webkit-overflow-scrolling: touch;
}
</style>
